<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>图书信息发布</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
    <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
    <link rel="stylesheet" href="./css/font.css">
    <link rel="stylesheet" href="./css/xadmin.css">
    <script type="text/javascript" src="core.js"></script>
    <script type="text/javascript" src="./lib/layui/layui.js" charset="utf-8"></script>
    <script type="text/javascript" src="./js/vue.js"></script>
    <script type="text/javascript" src="./js/sha.js"></script>
    <script type="text/javascript" src="./js/xadmin.js"></script>
    <script type="text/javascript" src="wangEditor.min.js"></script>
    <!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
    <!--[if lt IE 9]>
      <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
      <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
</head>
<style>
    .file {
        position: relative;
        display: inline-block;
        background: #D0EEFF;
        border: 1px solid #99D3F5;
        border-radius: 4px;
        padding: 4px 12px;
        overflow: hidden;
        color: #1E88C7;
        text-decoration: none;
        text-indent: 0;
        line-height: 20px;
    }

    .file input {
        position: absolute;
        font-size: 100px;
        right: 0;
        top: 0;
        opacity: 0;
    }

    .file:hover {
        background: #AADFFD;
        border-color: #78C3F3;
        color: #004974;
        text-decoration: none;
    }
</style>

<body>
    <div class="x-body layui-anim layui-anim-up">
        <div class="layui-form">

            <div class="layui-form-item">


                <div class="layui-form-item">
                    <label for="L_pass" class="layui-form-label">
                  <span class="x-red">*</span>图书名字
              </label>
                    <div class="layui-input-inline">
                        <input type="text" id="bookname"  value="" name="pass" required="" lay-verify="pass" autocomplete="off" class="layui-input">
                    </div>
                    <div class="layui-form-mid layui-word-aux">

                    </div>
                </div>
                 <div class="layui-form-item">


                <div class="layui-form-item">
                    <label for="L_pass" class="layui-form-label">
                  <span class="x-red">*</span>价格
              </label>
                    <div class="layui-input-inline">
                        <input type="text" id="price"  value="" name="pass" required="" lay-verify="pass" autocomplete="off" class="layui-input">
                    </div>
                    <div class="layui-form-mid layui-word-aux">

                    </div>
                </div>
                 <div class="layui-form-item">


                <div class="layui-form-item">
                    <label for="L_pass" class="layui-form-label">
                  <span class="x-red">*</span>作者
              </label>
                    <div class="layui-input-inline">
                       <input type="text" id="zuozhe"  value="" name="pass" required="" lay-verify="pass" autocomplete="off" class="layui-input">
                  
                         </div>
                    <div class="layui-form-mid layui-word-aux">

                    </div>
                </div>
                 <div class="layui-form-item">
                    <label for="L_pass" class="layui-form-label">
                  <span class="x-red">*</span>出版社
              </label>
                    <div class="layui-input-inline">
                       <input type="text" id="chubanshe"  value="" name="pass" required="" lay-verify="pass" autocomplete="off" class="layui-input">
                  
                         </div>
                    <div class="layui-form-mid layui-word-aux">

                    </div>
                </div>
                
     <div class="layui-form-item">
                    <label for="L_pass" class="layui-form-label">
                  <span class="x-red">*</span>出版日期
              </label>
                    <div class="layui-input-inline">
                    <input type="text" class="layui-input" id="day" placeholder="yyyy年MM月dd日" lay-key="12">    
                        </div>
                    <div class="layui-form-mid layui-word-aux">

                    </div>
                </div>
   <div class="layui-form-item" id="app">
                            <label for="L_pass" class="layui-form-label">
                  <span class="x-red">*</span>图书缩略图
              </label>
                            <div class="layui-input-inline">

                             <button class="layui-btn" onclick="uploadfile()">
                    上传缩略图
              </button>
               <span id="yulan"></span>
                           <span v-for="item in mylist" v-if="ishidden==1">
                           <video id="video" width="100%" height="100" :src="item" preload controls style="object-fit: fill" webkit-playsinline="true" x-webkit-airplay="true" playsinline="true" x5-video-player-type="h5" x5-video-player-fullscreen="true">
                           </video> </span>
                   
                            </div>

                        </div>
                          <div class="layui-form-item" id="app">
                            <label for="L_pass" class="layui-form-label">
                  <span class="x-red">*</span>伴读音频
              </label>
                            <div class="layui-input-inline">

                             <button class="layui-btn" onclick="uploadfile1()">
                    上传伴读音频
              </button>
              <span id="yunlan1"></span>
                           
                   
                            </div>

                        </div>
                          <div class="layui-form-item" id="app">
                            <label for="L_pass" class="layui-form-label">
                  <span class="x-red">*</span>电子读物
              </label>
                            <div class="layui-input-inline">

                             <button class="layui-btn" onclick="uploadfile2()">
                    上传电子读物
              </button>
              <span id="yunlan2"></span>
                           
                   
                            </div>

                        </div>
                       
                   <div class="layui-form-item">


                        <div class="layui-form-item layui-form-text">
                            <label for="L_pass" class="layui-form-label">
                                <span class="x-red">*</span>书籍描述<q></q>
                            </label>
                            <div class="layui-input-block" id='editor_1'>
                                <!--<textarea id="L_content" name="content" placeholder="家族其他患病成员情况" class="layui-textarea fly-editor" style="height: 260px;" v-model='otherInfo'></textarea>-->
                            </div>
                        </div>
                        

                        
                      


                            <div class="layui-form-item">
                                <label for="L_repass" class="layui-form-label">
              </label>
                                <button class="layui-btn" onclick="savedata()" >
                提交保存
              </button>
                            </div>
                        </div>
                    </div>
                    <script>
                      layui.use('laydate', function(){
  var laydate = layui.laydate;
  
  //执行一个laydate实例
  laydate.render({
    elem: '#day' //指定元素
  });
 
});
                        layui.use(['form', 'layer'], function() {
                            $ = layui.jquery;
                            var form = layui.form,
                                layer = layui.layer;
                            layer.ready(function() { //为了layer.ext.js加载完毕再执行
                                // alert("sfsdf")
                                layer.photos({
                                    photos: '#x-img'
                                    //,shift: 5 //0-6的选择，指定弹出图片动画类型，默认随机
                                });
                            });
                            layui.use('laydate', function() {
                                var laydate = layui.laydate;

                                //执行一个laydate实例
                               
                                laydate.render({
                                    elem: '#endtime' //指定元素
                                });

                                //执行一个laydate实例

                            });
                            //自定义验证规则
                            form.verify({
                                nikename: function(value) {
                                    if (value.length < 5) {
                                        return '昵称至少得5个字符啊';
                                    }
                                },
                                pass: [/(.+){6,12}$/, '密码必须6到12位'],
                                repass: function(value) {
                                    if ($('#L_pass').val() != $('#L_repass').val()) {
                                        return '两次密码不一致';
                                    }
                                }
                            });

                            //监听提交
                            form.on('submit(add)', function(data) {
                                console.log(data);
                                //发异步，把数据提交给php
                                layer.alert("增加成功", { icon: 6 }, function() {
                                    // 获得frame索引
                                    var index = parent.layer.getFrameIndex(window.name);
                                    //关��当前frame
                                    parent.layer.close(index);
                                });
                                return false;
                            });


                        });
                    </script>
                    <script>
                        var _hmt = _hmt || [];
                        (function() {
                            var hm = document.createElement("script");
                            hm.src = "https://hm.baidu.com/hm.js?b393d153aeb26b46e9431fabaf0f6190";
                            var s = document.getElementsByTagName("script")[0];
                            s.parentNode.insertBefore(hm, s);
                        })();
                    </script>
</body>

</html>
<script>

    var mylist=[]
    var shikan=''
    //初始化图编辑器
   var E = window.wangEditor
    var editor = new E('#editor_1')
    editor.customConfig.uploadImgShowBase64 = true // 使用 base64 保存图片
    // 或者 var editor = new E( document.getElementById('editor') )

    editor.create()
    var E = window.wangEditor
    var editor2 = new E('#editor_2')
    editor2.customConfig.uploadImgShowBase64 = true // 使用 base64 保存图片
    // 或者 var editor = new E( document.getElementById('editor') )

    editor2.create()

    var img = ''
function removeWordXml(text){
  var html = text;
  html = html.replace(/<\/?SPANYES[^>]*>/gi, "");//  Remove  all  SPAN  tags
  // html = html.replace(/<(\w[^>]*)  class=([^|>]*)([^>]*)/gi, "<$1$3");  //  Remove  Class  attributes
  // html = html.replace(/<(\w[^>]*)  style="([^"]*)"([^>]*)/gi, "<$1$3");  //  Remove  Style  attributes
  html = html.replace(/<(\w[^>]*)  lang=([^|>]*)([^>]*)/gi, "<$1$3");//  Remove  Lang  attributes
  html = html.replace(/<\\?\?xml[^>]*>/gi, "");//  Remove  XML  elements  and  declarations
  html = html.replace(/<\/?\w+:[^>]*>/gi, "");//  Remove  Tags  with  XML  namespace  declarations:  <o:p></o:p>
  html = html.replace(/&nbsp;/, "");//  Replace  the  &nbsp;
  html = html.replace(/\n(\n)*( )*(\n)*\n/gi, '\n');
   html = html.replace(/<xml>[\s\S]*?<\/xml>/ig, '')
   html = html.replace(/<style>[\s\S]*?<\/style>/ig, '')
     
      html= html.replace(/&nbsp;/ig, '')
  return html;
}
    function savedata() {
        
        
    }

   var vue=new Vue({
                  el:'#app',
                  data:{
                     mylist:[],
                     ishidden:0
                  },
                  methods:{
                     init(){
                         this.mylist=mylist
                     }  
                  }
              })
    window.onload = function() {
        localStorage.myviediolist=''
       
       
            
    }

    function readFile() {
        var file = this.files[0];
        //判断是否是图片类型
        if (!/image\/\w+/.test(file.type)) {
            alert("只能选择图片");
            return false;
        }
        var reader = new FileReader();
        reader.readAsDataURL(file);
        reader.onload = function(e) {
            img = this.result
            document.getElementById("yulan").src = img
        }


    }
      function question_add(title, url, w, h) {
            x_admin_show(title, url, w, h);
        }

    function uploadfile(){
        // alert(0)
        localStorage.myviediolist=''
         question_add('图片缩略图上传', 'shipin/index.html', '700', '400')
         var pid=setInterval(function(){
             if (localStorage.myviediolist!=''&&localStorage.myviediolist!=undefined&&localStorage.myviediolist!='undefined'){
                 clearInterval(pid) 
                 document.getElementById("yulan").innerHTML='<a href="'+localStorage.myviediolist+'" target="_blank" style="color:#fb4747">'+'预览附件</a>'
                 
             }  
         },1000)
    }
</script>
<script>
    //筛选大夫
  
    $(".radioItem").change(
        function() {
            var id = $("input[name='bankuai']:checked").val();
            alert(id)
            if (id == 1) {

            }
            else if (id == 2) {

            }
        });
      function initdata(){
         localStorage.myviediolist=''
         localStorage.myviediolist2=''
         localStorage.myviediolist3=''  
      }  
      initdata()
      function  uploadfile1(){
                   
                                                      localStorage.myviediolist2=''
                            question_add('伴读语音上传', 'shipin/index2.html', '700', '400')
                            var pid=setInterval(function(){
                                  if (localStorage.myviediolist2!='undefined'&&localStorage.myviediolist2!=''&&localStorage.myviediolist2!=undefined){
                                      clearInterval(pid)
                                       document.getElementById("yunlan1").innerHTML='<a href="'+localStorage.myviediolist2+'" target="_blank" style="color:#fb4747">'+'预览附件</a>'
                 
                                  }
                            },1000)
                      
      }
       function  uploadfile2(){
                   
                                                      localStorage.myviediolist3=''
                            question_add('电子书上传', 'shipin/index1.html', '700', '400')
                            var pid=setInterval(function(){
                                  if (localStorage.myviediolist3!='undefined'&&localStorage.myviediolist3!=''&&localStorage.myviediolist3!=undefined){
                                      clearInterval(pid)
                                       document.getElementById("yunlan2").innerHTML='<a href="'+localStorage.myviediolist3+'" target="_blank" style="color:#fb4747">'+'预览附件</a>'
                 
                                  }
                            },1000)
                      
      }
      //保存数据
      function savedata(){
          var bookname=document.getElementById("bookname").value
          if (bookname.length==0){
            layer.msg('请输入图书名字！',function(){

            })
            return false
          }
          var price=document.getElementById("price").value
          if (price.length==0){
             layer.msg('请输入图书价格！',function(){

            })
            return false
          }
          var zuozhe=document.getElementById("zuozhe").value
          if (zuozhe.length==0){
             layer.msg('请输入图书作者！',function(){

            })
            return false
          }
          var chubanshe=document.getElementById("chubanshe").value
          if (chubanshe.length==0){
             layer.msg('请输入出版社！',function(){

            })
            return false
          }
          var day=document.getElementById("day").value
          if (day.length==0){
            layer.msg('请输入出版日期！',function(){

            })
            return false
          }
          if (localStorage.myviediolist==''||localStorage.myviediolist==undefined||localStorage.myviediolist=='null'){
             layer.msg('请上传图书缩略图！',function(){

            })
            return false
          }
           if (localStorage.myviediolist2==''||localStorage.myviediolist2==undefined||localStorage.myviediolist2=='null'){
             layer.msg('请上传伴读读物！',function(){

            })
            return false
          }
          if (localStorage.myviediolist3==''||localStorage.myviediolist3==undefined||localStorage.myviediolist3=='null'){
             layer.msg('请上传电子读物！',function(){

            })
            return false
          }
           var content = editor.txt.html()
                      // content=removeWordXml(content)
        console.log(content)
        if (content == '<p><br></p>') {
            layer.msg('请上输入图书描述！', function() {

            });
            return false
        }
         var that = this
        now = Date.now();
        var appid = 'A6006135811896'
        var apptoken = '029BA0D4-D0F5-A3A9-D158-E0A88793E074'
        appKey = hex_sha1(appid + "UZ" + apptoken + "UZ" + now) + "." + now
        //alert(now)
        var url

        url = 'https://d.apicloud.com/mcm/api/books'
        
        $.ajax({
            "url": url,
            "method": "POST",
            "cache": false,
            "async": false,
            "headers": {
                "X-APICloud-AppId": appid,
                "X-APICloud-AppKey": appKey
            },
            "data": {
                bookname: bookname,
                img: localStorage.myviediolist,
                price: price,
                zuozhe: zuozhe,
                file1: localStorage.myviediolist2,
                file2: localStorage.myviediolist3,
                chubanshe: chubanshe,
                day: day,
                content: content,
               
            },
            "success": function(data, status) {
                layer.alert("图书发布成功", { icon: 6 }, function() {

                    parent.location.reload();

                    var index = parent.layer.getFrameIndex(window.name);
                    //关闭当前frame
                    parent.layer.close(index);
                })
            }
        })
      }
    
</script>
